/*
 * bsx-loading组件样式
 *
 * @Author: 谢力 843926058@qq.com
 * @Date:   2018-06-06 14:08:51
 * @Last Modified by:   谢力
 * @Last Modified time: 2018-06-06 14:08:56
 */
.app_loading-container{
	left:0;
	top:0;
	bottom:0;
	right:0;
	z-index:9998;
	&.m{
		left:50%;
		right:auto;
		width:20rem;
		transform:translateX(-50%);
	}
    .app_loading-content{
    	position: absolute;
    	left:50%;
    	top:50%;
        transform: translate(-50%,-50%);
    	border-radius: 5px;
		&.m{
			padding-top:6px;
		}
		.app_loading-warp{
			position: relative;
			.app_loading-box{
	        	position: absolute;
	        	left:10px;
	        	top:10px;
	        	right:10px;
	        	bottom:10px;
	            .app_loading-circular{
	            	position:absolute;
	            	width:100%;
	            	height:100%;
	            	left:0;
	            	top:0;
	            	animation: app_loading_keyframes-rotate 2s linear infinite;
	                .app_loading-path{
	                	stroke-dasharray: 90,150;
	                    stroke-dashoffset: 0;
	                    stroke-width: 4;
	                    stroke: #eee;
	                    stroke-linecap: round;
	                	opacity: 1;
	                	animation: app_loading_keyframes-dash 1.5s ease-in-out infinite;
	                }
	            }
	        }
		}
		.app_loading-text{
			text-align:center;
			color:#eee;
			font-size:12px;
			line-height:20px;
			padding:0 20px 10px;
		}
    }
}
@keyframes app_loading_keyframes-rotate{
	0%{
        transform:rotate(0deg)
    }
    100%{
        transform:rotate(360deg)
    }
}
@keyframes app_loading_keyframes-dash{
	0%{
        stroke-dasharray:1,200;
		stroke-dashoffset:0;
    }
    50%{
        stroke-dasharray:90,150;
		stroke-dashoffset:-40px;
    }
	100%{
		stroke-dasharray:90,150;
		stroke-dashoffset:-120px;
	}
}
.app_loading-enter-active,.app_loading-leave-active {
    transition:all ease-out 0.3s;
}
.app_loading-enter,.app_loading-leave-to {
    opacity: 0;
}
.app_loading-enter-to,.app_loading-leave {
    opacity:1;
}
